<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html class="win-frame">
<head>
<title>${name_china}管理-新建${name_china}</title>
 <%@include file="/common/headmy.jsp" %>


<!-- 时间日期插件 -->
<link href="<%=request.getContextPath()%>/static/plugin/My97DatePicker/skin/default/datepicker.css" rel="stylesheet" >
<script src="<%=request.getContextPath()%>/static/plugin/My97DatePicker/WdatePicker.js"></script>

<!-- 下拉树插件 -->
<link href="<%=request.getContextPath()%>/static/plugin/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" >
<script src="<%=request.getContextPath()%>/static/plugin/zTree/js/jquery.ztree.all-3.5.min.js"></script>

<!--富文本插件 -->
<script src="<%=request.getContextPath()%>/static/plugin/ckeditor/ckeditor.js"></script>


</head>
<body class="iframe-page">
<div class="page-title-wrapper">
    <div class="page-title">
        <div class="page-title-text">
            <span>${name_china}管理</span>
            <span class="split"></span>
            <span>新建${name_china}</span>
        </div>
        <a id="goBack" class="btn-return distance-left" href="javascript:;"><i class="icon icon-arrow-left"></i>返回上级</a>
    </div>
    <div class="page-title-border"></div>
</div>

<form id="addForm" method="post">
  <div id="left" style="width:80%;float:left">
	 <div class="form-wrapper">
		<div class="h4 distance-double">
	        <span class="h4-title"><i class="icon icon-setting"></i>基本信息</span>
	        <span class="h4-border"></span>
	    </div>
     
        <div class="form-cont" id="hiddenfile">
            <p class="form-cont-title"><span class="field-required">*</span>图片</p>
            <!-- 这里写表数据的附件字段  fileId -->
            <input id="fileId" name="fileId" type="text" class="summer-input distance-right">
            <input id="imageId" name="imageId" type="text" class="summer-input distance-right">
            <!-- 这里一定要写一个id隐藏 -->
            <input type="hidden" id="id" name="id"> 
         </div>
         
	     <div class="form-cont">
	        <p class="form-cont-title">排序号</p>
	        <input type="text" id="reorder" name="reorder" class="summer-input summer-validatebox"  data-validatebox="validType:['noNegativeNumber']"/> 
	     </div>
	     
	     <div class="form-cont">
	        <p class="form-cont-title"><span class="field-required">*</span>显示名称</p>
	        <input type="text" id="name" name="name" class="summer-input summer-validatebox"  data-validatebox="validType:['required','maxLength[50]']"/> 
	     </div>
	     
	      <div class="form-cont">
	        <p class="form-cont-title">付费类别</p>
	        <input type="text" id="category" name="category" class="summer-input summer-validatebox"  data-validatebox="validType:['maxLength[10]']"/> 
	     </div>
	     
<!-- 	      <div class="form-cont">
	        <p class="form-cont-title">价格</p>
	        <input type="text" id="price" name="price" class="summer-input"/> 
	     </div> -->
<!-- 	      <div class="form-cont">
	        <p class="form-cont-title">有效日期</p>
	        <input type="text" id="price" name="longTime" class="summer-input"/>年
	     </div> -->
	     
<!-- 	     <div class="form-cont">
	        <p class="form-cont-title">作者</p>
	        <input type="text" id="author" name="author" class="summer-input summer-validatebox"  data-validatebox="validType:['maxLength[50]']"/> 
	     </div> -->
	     
	    <!--  <div class="form-cont">
	        <p class="form-cont-title"> 开始时间</p>
	        <input type="text" id="startTime" name="startTime" class=" summer-input summer-validatebox" onFocus="var afterTime=$dp.$('stopTime');WdatePicker({dateFmt:'yyyy-MM-dd',onpicked:function(){afterTime.focus();},minDate:'#F{(\'%y-%M-%d\')}',maxDate:'#F{$dp.$D(\'stopTime\')}'})" /> 
	     </div>
	     
	    <div class="form-cont">
	        <p class="form-cont-title">结束时间</p>
	        <input type="text" id="stopTime" name="stopTime" class="summer-input" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startTime\')}'})"/> 
	     </div>
	     
	      <div class="form-cont">
	        <p class="form-cont-title">详细时间格式</p>
	        <input type="text" id="dateDetail" name="dateDetail" class="summer-input summer-validatebox"  onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" data-validatebox="validType:['maxLength[50]']"/> 
	     </div> -->
	 
<!-- 	    <div class="form-cont">
	        <p class="form-cont-title">有效日期</p>
	        <input type="text" id="publicationDate" name="publicationDate" class="summer-input summer-validatebox"  onFocus="WdatePicker({dateFmt:'yyyy-MM-dd'})" data-validatebox="validType:['maxLength[50]']"/> 
	     </div> -->
	     
<!-- 	     <div class="form-cont">
	        <p class="form-cont-title"><span class="field-required">*</span>级联下拉选项</p>
	        <input type="text" id="tree" name="tree" class="summer-input" style="width: 220px;" /> 
	     </div> -->
	    
<!-- 	     <div class="form-cont">
	        <p class="form-cont-title">须知详情</p>
	        <textarea class="ckeditor" id="styleText" name="styleText"></textarea>
	     </div> -->
	     
	      <div class="form-cont">
	        <p class="form-cont-title">备注</p>
	        <textarea class="summer-textarea" id="note" name="note"></textarea>
	     </div>
	      
	
	 <div class="form-btn-wrapper" id="funcbar">
        <a class="btn btn-normal" id="backBtn">关闭</a>
    </div>
  </div>
  </div>
	
</form>
<script>
    var  permission = CommonUtil.getPermission('${name_english}');
    
    $(function () {
    	
    	//初始化下拉选项
    	 $('#category').combobox({
            valueField : 'code',
            textField : 'name',
            url : COMMON_URL.getCode + '?type=T_WEB_GLOBAL_TYPE_CATEGORY'
        });
    	

    	
/*     	$('#price').validatebox({
    			      rules:{
    			            regex: {
    			                validator: function (value) {
    			                    var regex = new RegExp("^\\d+\\.\\d{1,"+3+"}$");
    			                    return regex.test(value);
    			                },
    			                message: '自定义验证浮点数'
    			            }
    			        },
    			        tipPosition: 'right',
    			        validType: ['regex[3]']
    	}); */
    	
    	  //初始化附件
	    initUploadConfig();
	   
    	//初始化funcbar
     	$('#funcbar').prepend($.funcbar({
            type: 'button',
            data: permission,
            permit: ['${name_english}:add']
        }));
   	 
    	
    	//保存按钮
    	$('#funcbar').on('click', 'a[data-permit="${name_english}:add"]', {isContinue: false},  submit);
    	
    	//返回按钮
    	$('#backBtn,#goBack').on('click',backMain);
    	
    });
    
    
	function initUploadConfig(){
		
		initMyUploadConfig("fileId","imageId","hiddenfile","T_MODEL_TEMPLET","${pageContext.session.id}");
		
	}
	
	  //初始化配置信息
	  function initMyUploadConfig (fileId,imageId,hiddenfile,tableName,sessionId){
         //隐藏图片变量 添加图片回显默认页面
	        $("#"+fileId).attr({"type" : "hidden"});
	        $("#"+imageId).attr({"type" : "hidden"});
          var filestr = `<img id="FileViewId" src=""  width="80px" onerror="javascript:this.src='` + CONST_URL.BASEIMAGE+`'"/>`;
          filestr = filestr + `<input name="file" type="file" accept="image/jpg,image/jpeg,image/png,image/gif" id="file">`;
          $("#"+hiddenfile).append(filestr); 
          initMutiFile(fileId,hiddenfile,tableName,sessionId);
     }

        //初始化图片和视频添加事件(记得动态添加表名)
      function initMutiFile(fileId,hiddenfile,tableName,sessionId){
	
	    //初始化图片上传事件
        var filone=$("#"+hiddenfile); 
        filone.bind('change',function(){  
            
                  //1 上传图片到文件服务器  返回图片参数    在文件服务器保存到数据库  
                  //id  fileUrl itemType fileType fileSize ctime status dtime
                  var formdata = new FormData(); 
                  formdata.append("file", $("#file").get(0).files[0]);
                  formdata.append("ind", 1);
                  formdata.append("userId", sessionId);
                  formdata.append("fileType", "image");
                  formdata.append("tableName", tableName);

                   $.ajax({
                       type: "POST",
                       //url: "http://192.168.199.124:8080/FileServer/upload",
                       url: COMMON_URL.upload,
                       dataType: "json",//返回值
                       data: formdata,
                       sync:true,
                       cache : false, 
                       contentType : "multipart/form-data-urlencoded; charset=utf-8", 
                       contentType:false, //必须false才会避开jQuery对 formdata 的默认处理 , XMLHttpRequest会对 formdata 进行正确的处理
                       processData: false, //必须false才会自动加上正确的Content-Type 
                       success: function (ro) {
                       	//var jsonString = JSON.stringify(ro);
                           if (ro.code == 200) {
                               //图片上传成功回调
                               //alert(ro.datas.id);
                               var ro_imageId = uploadFile(ro.datas,"imageId");
                               $("#imageId").attr({'value':ro_imageId});
                               //2 返回图片 id 和 图片地址 把图片id放到   fileId 字段中
                               //这里正常要是有视频ID 或   是图片ID 要先禁用id  再清空  图片和视频预览  再添加图片id
                                   $("#fileId").attr({'value':ro_imageId});
                                   $("#FileViewId").attr({'src':ro.datas.url});
                               //alert("文件(图片)ID数据到位:"+$("#fileId").val());
                           }
                           else {//图片未上传成功回调
                           	    alert(ro.message);
                           }
                       },
                       error: function (err) {
                           //服务器连接失败报错处理
                           alert("上传异常");
                           //alert(err.responseText);
                       },
                       beforeSend: function () {
                           //图片上传之前执行的操作，当前为进度条显示
                           //alert("图片正在上传中...");
                       }
                   });
            
            
        });
  

   }
     
    //上传图片和视频数据 + 文件字段
      function uploadFile(data,fieldv){
       	var ro_fileId = null;
          //保存数据到数据库   返回id
          $.sajax({
      		type : "get",
      		async : false,
      		//url : basePath + '/fileInfo/add',
      		url : COMMON_URL.fileinfoadd,
      		onLoadSuccess : function(ro){
      			if (ro.result == "success"){
      				//alert(ro.data);
      				ro_fileId = ro.data;
      			}
      		},
      		data:{
      			"tableName" : data.tableName,
      			"businessId" : data.id,
      			"field" : fieldv,
      			"fileName" : data.fileName,
      			"fileSuffix" : data.fileSuffix,
      			"fileSize" : data.fileSize,
      			"filePath" : data.url,
      			"vedioPath" : data.vedioUrl
      		}
      	});
      	return ro_fileId;
      }
    
      //   用 fileIds 获取文件列表 field为列表返名
      function getFileInfos(fileIds,field){
      	 var fileInfo = null;
          $.sajax({
       		type : "get",
       		async : false,
       		//url : basePath + '/fileInfo/getFileInfos',
       		url : COMMON_URL.getFileInfos,
       		onLoadSuccess : function(ro){
       			if (ro.result == "success"){
       				//alert(ro.data);
       				fileInfo = ro.data;
       			}
       		},
       		data:{
       			"fileIds" : fileIds,
       			"field" : field,
       		}
       	});
      	 
          return fileInfo;
      }


    
    
    //表单提交
    function submit(event) {
         $("#addForm").form({
        	 buttons : ['#saveBtn','#saveBtnContinue'],
             ajax: {
                 url: CONST_URL.ADD
             },
             onSubmitSuccess: function (data) {
            	 $.stip({
  	                type:'ok',//显示类型 有info、 ok、 danger
  	                text: '保存成功！',
  	                onBeforeHide: function () {
  	            	  var isContinue = event.data.isContinue;
  	            	  //alert(isContinue);
                   	  if (isContinue) {
                          resetForm();
                   	  } else {
                   		  backMain();
                   	  }
  	               }
              	});
              }
         }).form("submit");
    }
    
    //保存并继续清空form
    function resetForm(){
        //$('#xm,#zw,#cs,#bgdh,#sjhm').val('');
    }
    
    //返回主页面
    function backMain() {
    	window.location.href = CONST_URL.INIT_MAIN;
    }
    
   
    //请求url
    var CONST_URL = {
    	INIT_MAIN: basePath + "${common_url}init",
       	ADD: basePath + "${common_url}add",
       	BASEIMAGE: basePath + "/static/images/addimage.png",
    };
    
</script>
</body>
</html>